<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>客户管理列表</title>
		<link rel="stylesheet" type="text/css" href="${BASE_PATH}/static/lib/layui/css/layui.css" />
		<script src="${BASE_PATH}/static/lib/layui/layui.js" type="text/javascript" charset="utf-8"></script>
	</head>

	<body>
		<div class="layui-tab">
			<ul class="layui-tab-title">
				<li class="layui-this">功能选择</li>
				<li>筛选搜索</li>
			</ul>
			<div class="layui-tab-content">
				<div class="layui-tab-item layui-show">
					<button id="btn_user_add" class="layui-btn layui-btn-primary"><i class="layui-icon">&#xe654;</i>敬请期待</button>
				</div>
				<div class="layui-tab-item">
				<form class="layui-form">
					<div class="demoTable">
						<div class="layui-form-item">
							<div class="layui-inline">
								<div class="layui-input-inline">
									<input type="tel" name="userName" id="userName" lay-verify="required|phone" autocomplete="off" class="layui-input" placeholder="输入业务员姓名">
								</div>
							</div>
							<div class="layui-inline">
								<div class="layui-input-inline">
									<input type="text" name="oldTime" class="layui-input oldTime" id="test1" placeholder="起始时间">
								</div>
							</div>-
							<div class="layui-inline">
								<div class="layui-input-inline">
									<input type="text" name="newTime" class="layui-input newTime" id="test2" placeholder="结束时间">
								</div>
							</div>
							<div class="layui-inline">
								<div class="layui-input-inline">
									<a class="layui-btn"  data-type="reload"><i class="layui-icon">&#xe615;</i>搜索</a>
								</div>
							</div>
						</div>
					</div>
				</form>
				</div>
			</div>
		</div>
		
		<blockquote class="layui-elem-quote layui-text">坏账率：
			<span id="c" style="color: red;"></span> ，盈利：
			<span id="d" style="color: #007DDB;"></span> 元。
		</blockquote>

		<table id="demo" lay-filter="test"></table>

	</body>
	<script type="text/html" id="barDemo">
		<!--<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="user_info">查看</a>
		<a class="layui-btn layui-btn-xs" lay-event="edit">贷款</a>
		<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="money">收款</a>-->
	</script>
	<script>
		layui.use(['table', 'element', 'laydate', 'layer', 'jquery'], function() {
			var table = layui.table;
			var element = layui.element;
			var laydate = layui.laydate;
			var layer = layui.layer;
			$ = layui.jquery;

			var date = new Date();
			var seperator1 = "-";
			var seperator2 = ":";
			var year = date.getFullYear();
			var month = date.getMonth() + 1;
			var strDate = date.getDate();
			if(month >= 1 && month <= 9) {
				month = "0" + month;
			}
			if(strDate >= 0 && strDate <= 9) {
				strDate = "0" + strDate;
			}
			var currentdate = year + seperator1 + month + seperator1 + strDate +
				" " + date.getHours() + seperator2 + date.getMinutes() +
				seperator2 + date.getSeconds();

			var time = year + seperator1 + month + seperator1 + strDate
			var time1 = year + seperator1 + month + seperator1 + strDate

			var ins21 = laydate.render({
				elem: '#test1',
				type: 'datetime',
				min: '2017-12-31',
				max: currentdate,
				ready: function() {
					ins21.hint('日期可选值设定在 <br> 2017-12-31 到 ' + currentdate);
				}
			});

			var ins22 = laydate.render({
				elem: '#test2',
				type: 'datetime',
				min: '2018-01-01',
				max: currentdate,
				ready: function() {
					ins22.hint('日期可选值设定在 <br> 2018-01-01 到 ' + currentdate);
				}
			});

			table.render({
				elem: '#demo',
				done: function(res, curr, count){
				    $('#c').html(res.c);
				    $('#d').html(res.d);
				  },
				request: {
					pageName: 'pageNum',
					limitName: '16'
				},
				url: '${BASE_PATH}/admin/finance/ajax_finance_list',
				page: true,
				id: 'testReload',
				limit: 16,
				limits:[10,15,20,25,30],
				cols: [
					[ //表头
						{
							field: 'financeId',
							title: '财务ID',
						}, {
							field: 'yhUserName',
							title: '客户姓名',
						}, {
							field: 'userName',
							title: '业务员',
							sort: true
						}, {
							field: 'loanMoney',
							title: '业务员ID',
						}, {
							field: 'contractMoney',
							title: '合同金额',
						}, {
							field: 'start_time',
							title: '开始时间',
							sort: true
						}, {
							field: 'stop_time',
							title: '结束时间',
							sort: true
						}, {
							field: 'homeVisitsMoney',
							title: '家访金额',
						},
						{
							field: 'intermediary',
							title: '中介金额',
						},
						{
							field: 'bond',
							title: '保证金',
						},
						{
							field: 'actualMoney',
							title: '到手金额',
						},
						{
							field: 'stillMoney',
							title: '实际还款金额',
						},
						{
							field: 'collectMoney',
							title: '实际收款金额',
						},
						{
							field: 'huaizhang',
							title: '坏账率',
						},
						{
							field: 'yinli',
							title: '盈利',
						}
					]
				]
			});
			

			//监听工具条
			table.on('tool(test)', function(obj) {
				var data = obj.data;
				a = data;
				var layEvent = obj.event;
				var tr = obj.tr;
				console.dir(data)

			});
			
			var $ = layui.$, active = {
		        reload: function(){
		            var yhUserName = $('#yhUserName');
		
		            table.reload('testReload', {
		                where: {
		                    userName:$("#userName").val(),
		                    o:$(".oldTime").val(),
		                    n:$(".newTime").val()
		                }
		            });
		        }
		    };
		    
		    $('.demoTable .layui-btn').on('click', function(){
			    var type = $(this).data('type');
			    active[type] ? active[type].call(this) : '';
			});

		});
	</script>

</html>